<%@page contentType="text/html; charset=UTF-8" %>

<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<html>
    <head>
        <title>Event Page</title>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
        <meta name="description" content="Circular Content Carousel with jQuery" />
        <meta name="keywords" content="jquery, conent slider, content carousel, circular, expanding, sliding, css3" />
		<meta name="author" content="Codrops" />
		<link rel="shortcut icon" href="../favicon.ico"> 
        <link rel="stylesheet" type="text/css" href="css/demo.css" />
		<link rel="stylesheet" type="text/css" href="css/style.css" />
		<link rel="stylesheet" type="text/css" href="css/jquery.jscrollpane.css" media="all" />
		<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow&v1' rel='stylesheet' type='text/css' />
		<link href='http://fonts.googleapis.com/css?family=Coustard:900' rel='stylesheet' type='text/css' />
		<link href='http://fonts.googleapis.com/css?family=Rochester' rel='stylesheet' type='text/css' />
    </head>
<body>
	<div id="ca-container" class="ca-container">
		<div class="ca-wrapper">
			<div id="item1" class="ca-item ca-item-1">
				<div class="ca-item-main">
					<div class="ca-icon"><img src="images/${eventList[0].eventImage}"></div>
					<h3>${eventList[0].eventName}</h3>
					<h4>${eventList[0].companyName}</h4>
					<a href="#" class="ca-more">more...</a>
				</div>
				<div class="ca-content-wrapper">
					<div class="ca-content">
						<h6>${eventList[0].eventContent}</h6>
						<a href="#" class="ca-close">close</a>
						<div class="ca-content-text">
							<table class="table">
								<tr class="table-row">
									<td class="table-col1">이벤트 기간  :</td>
									<td class="table-col2"><fmt:formatDate value="${eventList[0].eventStartDate}" type="date"/> ~
									<fmt:formatDate value="${eventList[0].eventEndDate}" type="date"/></td>
								</tr>								
								<tr class="table-row">
									<td class="table-col1">경품 명  :</td>
									<td class="table-col2">${eventList[0].productName}</td>
								</tr>
								<tr class="table-row">
									<td class="table-col1">경품 수량  :</td>
									<td class="table-col2">${eventList[0].productQuantity} pcs</td>
								</tr>
								<tr class="table-row">
									<td class="table-col1">회사 명  :</td>
									<td class="table-col2">${eventList[0].companyName}</td>
								</tr>
							</table>
						</div>
						<ul>
							<li><a href=http://${eventList[0].companyHomepage}>홈페이지 가보기</a></li>
						</ul>
					</div>
				</div>
			</div>

			<div id="item2" class="ca-item ca-item-2">
				<div class="ca-item-main-center">
					<div class="today">오늘의 이벤트</div>
					<div class="ca-icon"><img src="images/${eventList[1].eventImage}"></div>
					<h3>${eventList[1].eventName}</h3>
					<h4>${eventList[1].companyName}</h4>
					<a href="#" class="ca-more">more...</a>
				</div>
				<div class="ca-content-wrapper">
					<div class="ca-content">
						<h6>${eventList[1].eventContent}</h6>
						<a href="#" class="ca-close">close</a>
						<div class="ca-content-text">
							<table class="table">
								<tr class="table-row">
									<td class="table-col1">이벤트 기간  :</td>
									<td class="table-col2"><fmt:formatDate value="${eventList[1].eventStartDate}" type="date"/> ~
									<fmt:formatDate value="${eventList[1].eventEndDate}" type="date"/></td>
								</tr>								
								<tr class="table-row">
									<td class="table-col1">경품 명  :</td>
									<td class="table-col2">${eventList[1].productName}</td>
								</tr>
								<tr class="table-row">
									<td class="table-col1">경품 수량  :</td>
									<td class="table-col2">${eventList[1].productQuantity} pcs</td>
								</tr>
								<tr class="table-row">
									<td class="table-col1">회사 명  :</td>
									<td class="table-col2">${eventList[1].companyName}</td>
								</tr>
							</table>
						</div>
						<ul>
							<li><a href=http://${eventList[1].companyHomepage}>홈페이지 가보기</a></li>
						</ul>
					</div>
				</div>
			</div>

			<div id="item3" class="ca-item ca-item-3">
				<div class="ca-item-main">
					<div class="ca-icon"><img src="images/${eventList[2].eventImage}"></div>
					<h3>${eventList[2].eventName}</h3>
					<h4>${eventList[2].companyName}</h4>
					<a href="#" class="ca-more">more...</a>
				</div>
				<div class="ca-content-wrapper">
					<div class="ca-content">
						<h6>${eventList[2].eventContent}</h6>
						<a href="#" class="ca-close">close</a>
						<div class="ca-content-text">
							<table class="table">
								<tr class="table-row">
									<td class="table-col1">이벤트 기간  :</td>
									<td class="table-col2"><fmt:formatDate value="${eventList[2].eventStartDate}" type="date"/> ~
									<fmt:formatDate value="${eventList[2].eventEndDate}" type="date"/></td>
								</tr>								
								<tr class="table-row">
									<td class="table-col1">경품 명  :</td>
									<td class="table-col2">${eventList[2].productName}</td>
								</tr>
								<tr class="table-row">
									<td class="table-col1">경품 수량  :</td>
									<td class="table-col2">${eventList[2].productQuantity} pcs</td>
								</tr>
								<tr class="table-row">
									<td class="table-col1">회사 명  :</td>
									<td class="table-col2">${eventList[2].companyName}</td>
								</tr>
							</table>
						</div>
						<ul>
							<li><a href=http://${eventList[2].companyHomepage}>홈페이지 가보기</a></li>
						</ul>
					</div>
				</div>
			</div>

			<div id="item4" class="ca-item ca-item-4">
				<div class="ca-item-main">
					<div class="ca-icon"><img src="images/${eventList[3].eventImage}"></div>
					<h3>${eventList[3].eventName}</h3>
					<h4>${eventList[3].companyName}</h4>
					<a href="#" class="ca-more">more...</a>
				</div>
				<div class="ca-content-wrapper">
					<div class="ca-content">
						<h6>${eventList[3].eventContent}</h6>
						<a href="#" class="ca-close">close</a>
						<div class="ca-content-text">
							<table class="table">
								<tr class="table-row">
									<td class="table-col1">이벤트 기간  :</td>
									<td class="table-col2"><fmt:formatDate value="${eventList[3].eventStartDate}" type="date"/> ~
									<fmt:formatDate value="${eventList[3].eventEndDate}" type="date"/></td>
								</tr>								
								<tr class="table-row">
									<td class="table-col1">경품 명  :</td>
									<td class="table-col2">${eventList[3].productName}</td>
								</tr>
								<tr class="table-row">
									<td class="table-col1">경품 수량  :</td>
									<td class="table-col2">${eventList[3].productQuantity} pcs</td>
								</tr>
								<tr class="table-row">
									<td class="table-col1">회사 명  :</td>
									<td class="table-col2">${eventList[3].companyName}</td>
								</tr>
							</table>
						</div>
						<ul>
							<li><a href=http://${eventList[3].companyHomepage}>홈페이지 가보기</a></li>
						</ul>
					</div>
				</div>
			</div>

			<div id="item5" class="ca-item ca-item-5">
			<div class="ca-item-main">
					<div class="ca-icon"><img src="images/${eventList[4].eventImage}"></div>
					<h3>${eventList[4].eventName}</h3>					
					<h4>${eventList[4].companyName}</h4>					
					<a href="#" class="ca-more">more...</a>
				</div>
				<div class="ca-content-wrapper">
					<div class="ca-content">
						<h6>${eventList[4].eventContent}</h6>
						<a href="#" class="ca-close">close</a>
						<div class="ca-content-text">
							<table class="table">
								<tr class="table-row">
									<td class="table-col1">이벤트 기간  :</td>
									<td class="table-col2"><fmt:formatDate value="${eventList[4].eventStartDate}" type="date"/> ~
									<fmt:formatDate value="${eventList[4].eventEndDate}" type="date"/></td>
								</tr>								
								<tr class="table-row">
									<td class="table-col1">경품 명  :</td>
									<td class="table-col2">${eventList[4].productName}</td>
								</tr>
								<tr class="table-row">
									<td class="table-col1">경품 수량  :</td>
									<td class="table-col2">${eventList[4].productQuantity} pcs</td>
								</tr>
								<tr class="table-row">
									<td class="table-col1">회사 명  :</td>
									<td class="table-col2">${eventList[4].companyName}</td>
								</tr>
							</table>
						</div>
						<ul>
							<li><a href=http://${eventList[4].companyHomepage}>홈페이지 가보기</a></li>
						</ul>
					</div>
				</div>
			</div>
		</div>
		<!-- ca-wrapper-->
	</div>
	<!-- ca-container-->

	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" ></script>
	<script type="text/javascript" src="css/jquery.easing.1.3.js"></script>
	<script type="text/javascript" src="css/jquery.mousewheel.js"></script>
	<script type="text/javascript" src="css/jquery.contentcarousel.js"></script>
	<script type="text/javascript"> $('#ca-container').contentcarousel(); </script>
</body>
</html>